<th:block xmlns:blc="http://www.w3.org/1999/html" xmlns:th="http://www.thymeleaf.org">
    <div class="card card-product card-plain no-shadow product-list-item js-productContainer"
         th:data-id="*{id}" data-colored-shadow="false">
        <div th:if="*{featuredProduct}" class="new-badge">
            New!
        </div>
        <a th:href="@{*{url}}">
            <div class="js-image image card-image">
                <img th:if="*{media['primary']}" blc:src="@{*{media['primary'].url} + '?browse'}" alt="Sauce Image"/>
                <!--Out Of Stock-->
                <h2 class="js-outOfStock out-of-stock is-hidden inCart card-title">
                    <i class="material-icons">info_outline</i>
                    <th:block th:utext="#{product.outOfStock}">Out Of Stock</th:block>
                </h2>
                <div class="js-outOfStock out-of-stock-overlay is-hidden"></div>
            </div>
        </a>

        <th:block th:replace="@{catalog/partials/productListItemHoverActions.html}" />

        <div class="card-content product-card">
            <h4 class="card-title product-title">
                <a th:href="@{*{url}}" th:utext="*{name}"></a>
            </h4>
            <th:block th:with="promoMessages=${#promotion_messages.getProductPromotionMessages(product, 'BROWSE')}">
                <div class="promotion-message" th:unless="${#lists.isEmpty(promoMessages)}">
                    <span th:text="${promoMessages[0].message}"></span>
                </div>
            </th:block>
            <!--Wishlist / Favorite -->
            <div class="footer" th:classappend="*{'product-actions js-productActions' + id}">
                <div class="product-price-container">
                    <div class="price"
                         th:if="${#object instanceof T(org.broadleafcommerce.core.catalog.domain.ProductBundle)}">
                        <span blc:price="*{salePrice}" th:if="*{onSale}" th:classappend="*{onSale}? 'price-new'" ></span>
                        <span blc:price="*{retailPrice}" th:classappend="*{onSale}? 'price-old'" ></span>
                    </div>
                    <div class="score" th:if="${#brc.sandbox} and *{defaultSku.score} != null">
                        <div th:utext="*{'Score = ' + #numbers.formatDecimal(defaultSku.score, 1, 3)}"></div>
                    </div>
                    <div class="price"
                         th:unless="${#object instanceof T(org.broadleafcommerce.core.catalog.domain.ProductBundle)}">
                        <span blc:price="*{salePrice}" th:if="*{onSale}" th:classappend="*{onSale}? ' price-new'" ></span>
                        <span blc:price="*{retailPrice}" th:classappend="*{onSale}? 'price-old'" ></span>
                    </div>
                </div>

                <th:block th:include="catalog/partials/wishlistButton" th:with="isCondensedProductView=${true}" />

                <!--In Cart-->
                <div class="js-inCartLinkContainer in-cart-link-container is-hidden">
                    <a th:href="@{/cart}" class="text-success text-center btn btn-simple"
                       rel="tooltip"
                       th:data-original-title="#{product.inCart}">
                        <i class="material-icons">shopping_cart</i>
                    </a>
                </div>
            </div>
        </div>
    </div>
</th:block>
